<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
    <title>智慧社区-物业管理</title>

    <meta name="description" content="Dashboard" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resource/assets/css/component.css" />
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/assets/img/favicon.png" type="image/x-icon">

    <link href="${pageContext.request.contextPath}/resource/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/font-awesome.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/beyond.min.css" rel="stylesheet" type="text/css" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/animate.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/dataTables.bootstrap.css" rel="stylesheet" />
    
		<script src="${pageContext.request.contextPath}/resource/assets/js/modernizr.custom.js"></script>
    <!--Skin Script: Place this script in head to load scripts for skins and rtl support-->
    <script src="${pageContext.request.contextPath}/resource/assets/js/skins.min.js"></script>

</head>
<body>
<div class="md-modal md-effect-11" id="modal-11">
			<div class="md-content">
			 <div class="modal-palegreen">
				 <div class="modal-dialog">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true" onclick="closeModal()">×</button>
                                                            <h4 class="modal-title">发送消息</h4>
                                                        </div>
                                                        <div class="modal-body">
                                                            <div class="row">
                                                                <div class="col-sm-12">
                                                                    <div class="form-group">
                                                                        <label for="exampleInputEmail2" id="receiver">消 息：</label>
                                                                        <span class="input-icon icon-right">
                                                                            <textarea class="form-control" rows="10" id="message"></textarea>
                                                                            <i class="glyphicon glyphicon-briefcase darkorange"></i>
                                                                        </span>
                                                                    </div>
                                                                    <input type="hidden" name="receiveId" id="receiveId"  />
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-warning" data-dismiss="modal" onclick="closeModal()">取 消</button>
                                                            <button type="button" class="btn btn-primary" onclick="sendMessage()">发 送</button>
                                                        </div>
                                                    </div><!-- /.modal-content -->
                                                </div><!-- /.modal-dialog -->
                                                </div>
			</div>
		</div>
		<div class="md-modal md-effect-11" id="modal-12">
			<div class="md-content">
			 <div class="modal-palegreen">
				 <div class="modal-dialog">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true" onclick="closeModal()">×</button>
                                                            <h4 class="modal-title">从Excel导入数据</h4>
                                                        </div>
                                                        <div class="modal-body">
                                                            <div class="row">
                                                                <div class="col-sm-12">
                                                                	<form id="excelForm" action="${pageContext.request.contextPath}/house_readExcel" method="post" enctype="multipart/form-data">
	                                                                     <div class="form-group">
														                      <label for="fileUpload">请选择后缀名为.xlxs格式的Excel文件：</label>
														                      <input type="file" id="fileUpload" name="upload">
														                      <p class="help-block">如过您不清楚数据表填写的格式，可以下载我们提供的模板作为参考。</p>
	                    												</div>
                    												</form>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-warning" data-dismiss="modal" onclick="closeModal()">取 消</button>
                                                            <button type="button" class="btn btn-primary" onclick="uploadExcel()">导 入</button>
                                                        </div>
                                                    </div><!-- /.modal-content -->
                                                </div><!-- /.modal-dialog -->
                                                </div>
			</div>
		</div>
<%@include file="../header.jsp" %>
	<!-- Main Container -->
    <div class="main-container container-fluid">
        <!-- Page Container -->
        <div class="page-container">
            <!-- Page Sidebar -->
            <%@include file="../nav.jsp" %><!-- /Page Sidebar -->
            <!-- Page Content -->
            <div class="page-content">
                <!-- Page Breadcrumb -->
                <div class="page-breadcrumbs">
                    <ul class="breadcrumb" style="margin-top: 8px;">
                        <li>
                            <i class="fa fa-home"></i>
                            <a href="../property.jsp">首页</a>
                        </li>
                        <li>房产管理</li>
                        <li class="active">房产信息</li>
                    </ul>
                </div><!-- /Page Breadcrumb -->
                <!-- Page Header -->
                <div class="page-header position-relative">
                    <div class="header-title" style="margin-top: 2px;">
                        <h1>
                            房产信息
                        </h1>
                    </div><!--Header Buttons-->
                    <div class="header-buttons">
                        <a class="sidebar-toggler" href="#">
                            <i class="fa fa-arrows-h"></i>
                        </a>
                        <a class="refresh" id="refresh-toggler" href="">
                            <i class="glyphicon glyphicon-refresh"></i>
                        </a>
                        <a class="fullscreen" id="fullscreen-toggler" href="#">
                            <i class="glyphicon glyphicon-fullscreen"></i>
                        </a>
                    </div><!--Header Buttons End-->
                </div><!-- /Page Header -->
                <!-- Page Body -->
                <div class="page-body">
                	 <div class="row">
                        <div class="col-xs-12 col-md-12">
                            <div class="widget">
                                <div class="widget-header bordered-bottom bordered-yellow">
                                    <span class="widget-caption">搜索业主姓名</span>
                                    <div class="widget-buttons">
                                        <a href="#" data-toggle="maximize">
                                            <i class="fa fa-expand"></i>
                                        </a>
                                        <a href="#" data-toggle="collapse">
                                            <i class="fa fa-minus"></i>
                                        </a>
                                        <a href="#" data-toggle="dispose">
                                            <i class="fa fa-times"></i>
                                        </a>
                                    </div>
                                </div>
                                <div class="widget-body no-padding">
                                <div class="table-toolbar">
                                        <a id="fromExcel" href="javascript:void(0);" class="btn btn-default" onclick="showDialog()" style="margin-left: 10px;">
                                            		从Excel导入
                                        </a>
                                    </div>
                                    <table class="table table-bordered table-hover table-striped" id="searchable" style="width: 100% !important;">
                                        <thead class="bordered-darkorange">
                                            <tr role="row">
                                                <th>序号</th>
						                        <th>地址</th>
						                        <th>面积</th>
						                        <th>业主</th>
						                        <th>联系电话</th>
						                        <th>下次物业费缴纳时间</th>
						                        <th>操作</th>
                                            </tr>
                                        </thead>

                                        <tfoot>
                                            <tr>
                                                <th>序号</th>
						                        <th>地址</th>
						                        <th>面积</th>
						                        <th>业主</th>
						                        <th>联系电话</th>
						                        <th>下次物业费缴纳时间</th>
						                        <th>操作</th>
                                            </tr>
                                        </tfoot>
                                        <tbody>
                                          
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div><!-- /Page Body -->
             </div><!-- /Page Content -->
     	</div><!-- /Page Container -->
     </div><!-- /Main Container -->
     	<div class="md-overlay" onclick="closeModal()"></div>
     	<script src="${pageContext.request.contextPath}/resource/assets/js/jquery-2.0.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/bootstrap.min.js"></script>

    <!--Beyond Scripts-->
    <script src="${pageContext.request.contextPath}/resource/assets/js/beyond.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/assets/js/datatable/jquery.dataTables.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/datatable/ZeroClipboard.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/datatable/dataTables.bootstrap.min.js"></script>
		<script>
			var polyfilter_scriptpath = '/js/';
		</script>
		<script src="${pageContext.request.contextPath}/resource/assets/js/cssParser.js"></script>
		<script src="${pageContext.request.contextPath}/resource/assets/js/css-filters-polyfill.js"></script>
   <script src="${pageContext.request.contextPath}/resource/assets/js/bootbox/bootbox.js"></script>
   <script src="${pageContext.request.contextPath}/resource/layer/layer.js"></script>
    <script type="text/javascript">
    var hostId = "${param.hostId}";
    var attachId = "${param.attachId}";
    var iRowIndex = 1;
    	$(document).ready(function(){
    		layer.config({extend: 'extend/layer.ext.js'});
    		$('#menu_house').addClass("active open");
    		$('#menu_house_list').addClass("active");
    		//InitiateSearchableDataTable.init();
    		$('#searchable').dataTable({
                "sDom": "Tflt<'row DTTTFooter'<'col-sm-6'i><'col-sm-6'p>>",
                
                "aLengthMenu": [
                   [50,75,100],
                   [50,75,100]
                ],
                "iDisplayLength": 50,
                "oLanguage": {
                    "sLengthMenu": "_MENU_",
                    "sZeroRecords": "对不起，查询不到任何相关数据",
                    "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",
                    "sInfoEmpty": "找不到相关数据",
                    "sInfoFiltered": "数据表中共为 _MAX_ 条记录)",
                    "sProcessing": "正在加载中...",
                    "sSearch": "",
                    "sUrl": "", 
                    "oPaginate": {
                        "sFirst":    " 首页",
                        "sPrevious": " 上一页 ",
                        "sNext":     " 下一页 ",
                        "sLast":     " 末页 "
                    }
                },
                "bStateSave": true,
                "bProcessing": false, 
         		"bServerSide": true,
         		"bSort": true,
         	    "sAjaxSource": "${pageContext.request.contextPath}/house_list",
         	    "fnServerData": retrieveData, 
         	    "aoColumns":
         	           [  
								{ "mData": "rowIndex",
								  "sDefaultContent" : "",
								  "sWidth":"60px",
								  "mRender": function (data, type, full) {
		         						return iRowIndex++;
		                     		}
								},
								{ "mData": "disAddress","sDefaultContent" : ""}, 
								{ "mData": "area","sDefaultContent" : ""},
								{ "mData": "name","sDefaultContent" : ""},
								{ "mData": "phoneNumber","sDefaultContent" : ""},
								{ "mData": "notifyDate",
									  "sDefaultContent" : "",
									  "mRender": function (data, type, full) {
			         						if (full.notifyDate != null && full.notifyDate != "") {
												return unixToDate(full.notifyDate,false);
											}
			         						return "";
			                     		}
									},
								{ "mData": "operate",
		         	        		"sDefaultContent" : "",
		         	        		"sWidth":"160px",
		         	        		"mRender": function (data,type,full){
		         	        			var lock = 0;
		         	        			if (full.user != null) {
											lock = 1;
										}
		         	        			return '<div class="btn-group">'+
		         	        			'<a class="btn btn-azure" title="'+full.objectId+'" name="'+full.disAddress+'" href="#" onclick="showModal(this)">发送消息</a>'+
		         	        			'<a class="btn btn-azure dropdown-toggle" data-toggle="dropdown" href=""><i class="fa fa-angle-down"></i></a>'+
		         		        		' <ul class="dropdown-menu dropdown-azure">'+
		         		        		'<li><a title="'+full.objectId+'" name="'+lock+'" href="#" onclick="setPassword(this)">设置开门密码</a></li>'+
		         		        		'<li><a title="'+full.objectId+'" name="'+lock+'" href="#" onclick="setReceiver(this)">设置呼叫电话</a></li>'+
		         		        		 '</ul></div>';
		         	        		}
		         	        	}
         	            ]
         		
            });
            
    		function retrieveData( sSource,aoData, fnCallback) {
            	iRowIndex = 1;
    			$.ajax({
    				"url" : sSource,
    				"data" : {"aoData":JSON.stringify(aoData),"hostId":hostId,"attachId":attachId},
    				"type" : 'post',
    				"dataType" : 'json',
    				"success" : function(result) {
    					$('.loading-container').hide();
    					if(result == 201){
    						alert("鉴权已过期，请重新登录");
    						location.href="/WisdomHome";
    						return;
    					}
    					fnCallback(result);
    				},
    				"error" : function(msg) {
    					alert("error msg:"+msg.responseText);
    				}
    			});
    		}
            
    	});
    	
    	function editHouse(obj){
    		
    		if (obj.name == 1) {
    			alert("很抱歉，该房产已被业主绑定，无法修改，请联系业主！");
    			return;
			}
    		
    		location.href="${pageContext.request.contextPath}/manager_editHouse?houseId="+obj.title;
    		
    	}
    	
    	function setPassword(obj){
    		layer.prompt({
	    	    title: '请输入四位数字密码',
	    	    formType: 0 
	    	}, function(pass){
	    		var re = /^\d{4}$/;
	    	    if (!re.test(pass)) {
					layer.msg('密码只能是四位数字', {
					    icon:2,
					    time: 0,
					    btn: ['确定'],
					    yes: function(index){
					       layer.close(index);
					    }
					});
				}else {
					$.ajax({
						url:"${pageContext.request.contextPath}/manager_setPassword",
						data:{houseId:obj.title,password:pass},
						type:'post',
						success:function(data){
							if (data == 201) {
								location.href="/WisdomHome";
							}else{
								layer.msg('开门密码设置成功，请输入房号加密码开门', {
								    icon:6,
								    time: 0,
								    btn: ['确定'],
								    yes: function(index){
								       layer.close(index);
								    }
								});
							}
						},
						error:function(data){
							console.log(data.responseTexst);
						}
					});
				}
	    	});
    	}
    	
    	function setReceiver(obj){
    		layer.prompt({
	    	    title: '请输入手机号或固定电话号码',
	    	    formType: 0 
	    	}, function(pass){
	    		var re = /^(0?1[358]\d{9})$|^((0(10|2[1-3]|[3-9]\d{2}))?[1-9]\d{6,7})$/;
	    	    if (!re.test(pass)) {
					layer.msg('呼叫号码必须是正确的手机号或固定电话号码', {
					    icon:2,
					    time: 0,
					    btn: ['确定'],
					    yes: function(index){
					       layer.close(index);
					    }
					});
				}else {
					$.ajax({
						url:"${pageContext.request.contextPath}/manager_setReceiver",
						type:'post',
						data:{
							houseId:obj.title,
							receiver:pass
						},
						success:function(data){
							if (data == 201) {
								location.href="/WisdomHome";
							}else{
								layer.msg('呼叫号码设置成功', {icon:6});
							}
						},
						error:function(data){
							console.log(data.responseTexst);
						}
					});
				}
	    	});
    	}
    	
    	function showModal(obj){
    		$('#receiveId').val(obj.title);
    		$('#receiver').html(obj.name+" :");
    		$('#modal-11').addClass("md-show");
    	}
    	
    	function closeModal(){
    		$('#modal-11').removeClass("md-show");
    		$('#modal-12').removeClass("md-show");
    	}
    	
    	function test(){
    		alert("test");
    	}
    	
    	function sendMessage(){
    		var houseId = $('#receiveId').val();
    		var message = $('#message').val();
    		
    		if($.trim(message) == ""){
    			return;
    		}
    		
    		$.ajax({
    			"url" : "${pageContext.request.contextPath}/push_toHouse",
				"data" : {houseId:houseId,message:message},
				"type" : 'post',
				"dataType" : 'json',
				"success" : function(result) {
					if (result == 200) {
						alert("发送成功");
						closeModal();
					}else {
						alert("鉴权已过期，请重新登录");
						location.href="/WisdomHome";
						return;
					}
				},
				"error" : function(msg) {
					alert("error msg:"+msg.responseText);
				}
    		});
    	}
    	
    	function showDialog(){
    		$('#modal-12').addClass("md-show");
    	}
    	
    	function uploadExcel(){
			 $('#excelForm').submit();
			 $('.loading-container').show();
			 
		}
    </script>
</body>
</html>